import React, { ReactElement } from "react";
import { List, Radio, RadioChangeEvent, Typography } from "antd";
import prices from "@/helps/price";
const { Title } = Typography;

interface Props {
  handleFilter: (arg: number[]) => void;
}

export default function RadioBox(props: Props): ReactElement {
  const onChange = (event: RadioChangeEvent) => {
    console.log(event.target.value);
    props.handleFilter(event.target.value);
  };
  return (
    <>
      <Title level={4}>按照价格筛选</Title>
      <Radio.Group>
        <List
          dataSource={prices}
          renderItem={(item) => {
            return (
              <List.Item>
                <Radio onChange={onChange} value={item.array}>
                  {item.name}
                </Radio>
              </List.Item>
            );
          }}
        ></List>
      </Radio.Group>
    </>
  );
}
